$(function(){
    //获取地址栏中传递的商品productId
    var productId = new URLSearchParams(location.search).get("productId");
    console.log(productId);

    //判断用户访问detail.html的时候有没有携带productId的参数，有参数才认为是一次正确的访问
    //如果没有参数，认为是错误的访问形式，提示用户即可
    if(!productId){
        mui.alert("请从搜索结构页面点击商品进行购买");
        return false;
    }

    //根据id查询id对应的商品信息
    $.ajax({
        url:"/product/queryProductDetail",
        data:{ id:productId },
        success:function(res){
            console.log(res);
            //使用模板引擎将商品信息渲染到页面中展示
            var html = template("product",res);

            // console.log(html);
            $(".mui-content").html(html);

            //mui的组件如果是后续生成的代码，那么必须要重新初始化，才能让组件可以使用
            mui('.mui-slider').slider();
            mui(".mui-numbox").numbox();
        }
    })
    

    //监听尺码span的点击事件，使用事件委托
    $(".mui-content").on("click",".detail-size span",function(){
        $(this).addClass("active").siblings().removeClass("active");
    })

    //使用事件委托给加入购物车按钮添加点击事件
    $(".mui-content").on("click","#addCart",function(){
        //需要商品id，数量，尺码
        var num = $("#test").val();
        var size = $(".mui-content .detail-size span[class='active']").text();
        // console.log(productId,num,size);
        //发送请求添加到购物车
        $.ajax({
            url:"/cart/addCart",
            type:"post",
            data:{ productId,num,size },
            success:function(res){
                if(res.success){
                    mui.confirm("添加成功，去购物车看看？","温馨提示",["确定","取消"],(e)=>{
                        if(e.index === 0){
                            //去购物车看看
                            location.href = "cart.html";
                        }
                    })
                }else{
                    mui.alert(res.message);
                }
            }
        })
    })
    
})